<template>
	<div class="rightHeader" :class="{border: showBorderChild}">
		<span class="header-name">{{headerName}}</span><!--
		--><span class="trans-text" v-if="isShowChild">移植编号：</span><!--
		--><span class="trans-number" v-if="isShowChild">{{transNumberChild}}</span>
		<span class="header-btn" @click="btnMethod">{{btnTextChild}}</span>
	</div>
</template>
<script>
	export default {
		props: ['headerName', 'isShow', 'transNumber','showBorder','btnText'],
		data() {
			return {
				isShowChild: false,
				showBorderChild: false,
				transNumberChild:'',
				btnTextChild:''
			}
		},
		methods: {
			btnMethod(){
				this.$emit('headmethod');
			}
		},
		created(){
			if(this.isShow){
				this.isShowChild = this.isShow
			}
			if(this.showBorder){
				this.showBorderChild = this.showBorder
			}
			if(this.transNumber){
				this.transNumberChild = this.transNumber
			}
			if(this.btnText){
				this.btnTextChild = this.btnText
			}
		}

			
	}
</script>
<style lang='scss' rel='stylesheet/scss' scoped>
	.border{
		border-bottom: 1px solid #E1E2E2;
	}
	.rightHeader{
		// height: 60px;
		// line-height: 60px;
		padding: 20px 0;
		.header-name{
			font-size: 16px;
			color: #323232;
		}
		.trans-text{
			display: inline-block;
			font-size: 12px;
			color: #666;
			border-left: 1px solid #666;
			height: 20px;
			line-height: 20px;
			margin-left: 20px;
			padding-left: 20px;
		}
		.trans-number{
			display: inline-block;
			height: 20px;
			line-height: 20px;
			font-size: 12px;
			color: #3F8DE1;
		}
		.header-btn{
			font-size: 12px;
			line-height: 20px;
			color: #666;
			float: right;
			cursor: pointer;
		}
	}
</style>